<template>
	<uni-popup ref="pay_pop">
		<view class="pay4s">
			<view class="title">
				支付确认
			</view>
			<view class="pay_content">
				<image class="black_1" src="../../static/index/zhifu_comfig.png">
				</image>
				<uni-easyinput class="inputs inputs2" type="password" v-model="password" :inputBorder="false"
					:styles="{backgroundColor: 'transparent'}" placeholder="请输入支付密码"
					placeholder-style="color:#A7A7A7;font-size:16px"></uni-easyinput>
				<view class="black_2">
					<text class="text1">本次您需支付</text>
					<text class="text2">{{getPrice()}}</text>
				</view>
				<view class="black_3" @click="topay()">
					<text class="text1">确认支付</text>
				</view>
			</view>
		</view>
		<view style="height: 20px;"></view>
		<view class="bottom">
			<image class="close" @click="close" src="/static/my/close2.png"></image>
		</view>
		<paySuccess ref="paySuccess"></paySuccess>
	</uni-popup>
</template>

<script>
	import paySuccess from '@/components/pay/paySuccess.vue'
	export default {
		props:{
			success:{
				type:Function,
			}
		},
		components: {
			paySuccess
		},
		name: "pay",
		data() {
			return {
				current: 0,
				password: '',
				item: {},
				type: 0, //0 购买车 usdt 1 碎片兑换车 2 购买车位
			};
		},
		methods: {
			open(type, item) {
				this.type = type
				this.item = item
				console.log(item)
				this.$refs.pay_pop.open()
			},
			close() {
				this.$refs.pay_pop.close()
			},
			getPrice() {
				if (this.type == 0) {
					return this.item.price + 'U'
				}
				if (this.type == 1) {
					return this.item.car_num + '碎片'
				}
				if (this.type == 2) {
					return this.item.price + 'U'
				}
			},
			topay() {
				var url = ''
					var mess="成功"
				var data = {}
				if (!this.password) {
					uni.showToast({
						title: "请输入密码"
					})
					return
				}
				if (this.type == 0 || this.type == 1) {
					url = 'carshop/buy'
					data.id = this.item.id
					data.account_type = this.type == 0 ? 'usdt' : 'debris'
					data.pay_password = this.password
				}
				if (this.type == 2) {
					data.id = this.item.id
					data.pay_password = this.password
					url = 'grageshop/buy'
				}
			
				this.api.http.requests(url, data, res => {
					uni.showToast({
						url: "成功",
					})
					if (this.success) {
						this.success()
					}
					this.close()
					if (this.type <= 1) {
						this.$refs.paySuccess.open(this.type, this.item)
					}
					uni.$emit('paySuccsse', {
						type: 1,
						msg: res.msg
					})
				}, "POST")


			},
		}
	}
</script>

<style scoped lang="less">
	.pay4s {
		background: linear-gradient(295deg, #D2823A 0%, #EF9164 100%);
		border-radius: 10px;
		padding: 2px;
		text-align: center;
		width: 650rpx;

		.pay_content {
			background-color: #F9F3E5;
			border-radius: 10px;
		}

		.title {
			text-align: center;
			font-size: 49rpx;
			font-weight: 800;
			color: #FFFFFF;
			padding: 5px;
		}

		.black_1 {
			width: 200px;
			height: 120px;
			margin: 25px 10px 0px 10px;
		}

		.inputs {
			margin: auto;
			width: 80%;
			padding: 5px 0px;
			border: 1px solid #FFE6D5;
			font-size: 30rpx;
			font-weight: 400;
			background: #DDD2C8;
			border-radius: 40px;
			text-align: center;
		}

		.black_2 {
			margin-top: 10px;
			font-size: 25rpx;
			font-weight: 400;
			color: #969696;

			.text2 {
				color: #FE903D;
			}
		}

		.black_3 {
			padding: 35px 10px 40px 10px;

			.text1 {
				font-size: 32rpx;
				font-weight: bold;
				color: #FFFFFF;
				background: #FE903D;
				border-radius: 18rpx;
				padding: 10px 38px;
			}
		}
	}

	.bottom {
		text-align: center;
	}

	.close {
		text-align: center;
		margin: auto;
		width: 30px;
		height: 30px;
	}
</style>